<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<style>
    body{
        background-color: #efeff4;
    }
    .logout{
        width: 100%;
        margin-top: 20px;
        text-align: center;
    }
    .logout .logout_btn{
        font-size: 1.3rem;
        padding: 1rem 0;
        background: #FFF;
        display: inline-block;
        width: 95%;
    }
    .logout .logout_btn a{
        color: #000;
    }
    .vip_center .vip_header .name{
        color: #000;
    }
    .vip_center .vip_span h4 {
        color: #000;
    }
    .vip_center .vip_ul li .lzz {
        color: #000;
    }
    .vip_center .vip_header .name:after{margin-top: 10px;display: inline-block; width: 15px; height: 15px; content: ''; background: url('<%=basePath%>app/images/right-arrow.png') no-repeat 0px 0px; background-size: 60%; float: right; }
</style>
<div class="vip_center">
    <script type="text/html" id="tpl-center">
    <div class="vip_header">
        <a class="login">
            <div class="header_box">
                <div class="touxiang">
                    <img src="{{resultList.head_url}}" alt="">
                </div>
                <div class="name"><span>{{resultList.nick_name}}</span></div>
            </div>
        </a>
    </div>
    <div class="vip_span">
        <div class="col-xs-4 text-center">
            <a>
                <div class="vip_banner" id="single">
                    <img src="<%=basePath%>/app/images/user/single.svg" />
                    <h4>单篇</h4>
                </div>
            </a>
            <a>
                <div class="vip_banner" id="collect">
                    <img src="<%=basePath%>/app/images/user/collect.svg" />
                    <h4>收藏</h4>
                </div>
            </a>
            <a>
                <div class="vip_banner" id="focus">
                    <img src="<%=basePath%>/app/images/user/focus.svg" />
                    <h4>关注</h4>
                </div>
            </a>
            <a>
                <div class="vip_banner" id="history">
                    <img src="<%=basePath%>/app/images/user/history.svg" />
                    <h4>历史</h4>
                </div>
            </a>
        </div>
    </div>
    <ul class="vip_ul">
        <li>
            <a>
                <div class="lzz" id="message">消息</div>
            </a>
        </li>
        <li>
            <a>
                <div class="lzz" id="order">订单</div>
            </a>
        </li>
        <li>
            <a>
                <div class="lzz" id="suggest">意见反馈</div>
            </a>
        </li>
    </ul>
    <div class="logout">
        <div class="logout_btn">
            <a href="javascript:;" id="logout">退出登录</a>
        </div>
    </div>
    </script>
</div>
<jsp:include page="nav.jsp" />
<script>
    $(function () {
        loadData();

        //个人信息
        mui('body').on("tap",".vip_header",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_info"
            })
        });
        //单篇阅读
        mui('body').on("tap","#single",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_single"
            })
        });
        //收藏阅读
        mui('body').on("tap","#collect",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_collect"
            })
        });
        //历史阅读
        mui('body').on("tap","#history",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_history"
            })
        });
        //关注作者
        mui('body').on("tap","#focus",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_focus"
            })
        });
        //消息
        mui('body').on("tap","#message",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_message"
            })
        });
        //反馈
        mui('body').on("tap","#suggest",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_suggest"
            })
        });
        //订单
        mui('body').on("tap","#order",function () {
            mui.openWindow({
                url:_basePath + "app/page?pv=mine_order"
            })
        });

    });

    function loadData() {
        //加载会员数据
        $.ajax({
            url: _basePath + "/app/member/info",
            dataType : 'json',
            success :function (data) {
                if(typeof data.resultList != undefined && data.resCode == 0){
                    var _html = template('tpl-center', data);
                    $(".vip_center").append(_html);
                    $(".logout").on("tap", function () {
                        logout();
                    })
                }
            }
        });

    }

    function logout() {
        $.ajax({
            url: _basePath + "/app/member/logout",
            dataType : 'json',
            success :function (data) {
                if(typeof data.resultList != undefined && data.resCode == 0){
                    mui.toast("注销成功");
                    setTimeout(function () {
                        mui.openWindow({
                            url:_basePath + "app/page?pv=mine"
                        });
                    },1000)
                }
            }
        });
    }
</script>